<?php 
    $env = Jnd_App::getEnvironnement();
?>
<!DOCTYPE HTML>
<html>
<head>
<title>OSML Badminton <?php echo ($this->titrePage != "" ? " - " . $this->titrePage : "")?></title>
<meta name="description" content="website description">
<meta name="keywords" content="website keywords, website keywords">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<link rel="stylesheet" type="text/css" href="<?php echo $this->baseUrl('css/style.css');?>">
<!-- modernizr enables HTML5 elements and feature detects -->
<script type="text/javascript"
	src="<?php echo $this->baseUrl('js/modernizr-1.5.min.js')?>"></script>
	<?php
        echo $this->headLink();
        echo $this->jQuery()->uiEnable()
            ->setLocalPath($this->baseUrl('/js/jquery-1.7.2.min.js'))
            ->setUiLocalPath($this->baseUrl('/js/jquery-ui-1.8.20.custom.min.js'))
            ->addStylesheet($this->baseUrl('/css/jQuery/flick/jquery-ui-1.8.20.custom.css'))
        	->addJavascriptFile('/js/jquery.sooperfish.js')
        	->addJavascriptFile('/js/jquery.easing-sooper.js');
        $this->jQuery()->addOnLoad("
        	$('#images').kwicks({  
		        max : 600,  
		        spacing : 3,  
		        isVertical : false  
		    });
			$('ul.sf-menu').sooperfish({ 
        		dualColumn : 6, 
        		//if a submenu has at least this many items it will be divided in 2 columns 
        		tripleColumn : 8, 
        		//if a submenu has at least this many items it will be divided in 3 columns 
        		hoverClass : 'sfHover', 
        		delay : 500, 
        		//make sure menus only disappear when intended, 500ms is advised by Jacob Nielsen 
        		animationShow : {
        			width:'show',
        			height:'show',
        			opacity:'show'
				}, 
        		speedShow : 750, 
        		easingShow : 'easeOutBounce', 
        		animationHide : {
        			width:'hide',
        			height:'hide',
        			opacity:'hide'}, 
        			speedHide : 300, 
        			easingHide : 'easeInOvershoot', 
        			autoArrows : true 
				}); 
        ");
        echo $this->render("actions.phtml");
    ?>
</head>
<body>
	<div id="main">
		<header>
			<div id="logo">
				<div id="logo_text">
					<!-- class="logo_colour", allows you to change the colour of the text -->
					<h1>
						<a href="/">OSML<span class="logo_colour"> Badminton</span></a>
					</h1>
					<h2><?php echo __("Équipe de sports amateur")?></h2>
				</div>
			</div>
			<nav>
				<ul class="sf-menu" id="nav">
					<li class="selected"><a href="/"><?php echo __('Acceuil')?></a></li>
					<li><a href="examples.html">Examples</a></li>
					<li><a href="page.html">A Page</a></li>
					<li><a href="another_page.html">Another Page</a></li>
					<li><a href="#">Example Drop Down</a>
						<ul>
							<li><a href="#">Drop Down One</a></li>
							<li><a href="#">Drop Down Two</a>
								<ul>
									<li><a href="#">Sub Drop Down One</a></li>
									<li><a href="#">Sub Drop Down Two</a></li>
									<li><a href="#">Sub Drop Down Three</a></li>
									<li><a href="#">Sub Drop Down Four</a></li>
									<li><a href="#">Sub Drop Down Five</a></li>
								</ul></li>
							<li><a href="#">Drop Down Three</a></li>
							<li><a href="#">Drop Down Four</a></li>
							<li><a href="#">Drop Down Five</a></li>
						</ul></li>
					<li><a href="contact.php">Contact Us</a></li>
				</ul>
			</nav>
		</header>
		<div id="site_content">
			<ul id="images">
				<li><img src="<?php echo $this->baseUrl('images/1.jpg');?>"
					width="600" height="300" alt="photo_one"></li>
				<li><img src="<?php echo $this->baseUrl('images/2.jpg');?>"
					width="600" height="300" alt="photo_two"></li>
				<li><img src="<?php echo $this->baseUrl('images/3.jpg');?>"
					width="600" height="300" alt="photo_three"></li>
				<li><img src="<?php echo $this->baseUrl('images/4.jpg');?>"
					width="600" height="300" alt="photo_four"></li>
				<li><img src="<?php echo $this->baseUrl('images/5.jpg');?>"
					width="600" height="300" alt="photo_five"></li>
				<li><img src="<?php echo $this->baseUrl('images/6.jpg');?>"
					width="600" height="300" alt="photo_photo"></li>
			</ul>
			<div class="content">
				<?php echo $this->layout()->content; ?>
			</div>
		</div>
		<footer>
			<p>
				Copyright &copy; CSS3_photo | <a href="http://www.css3templates.co.uk">design from css3templates.co.uk</a>
				<!--%@##-->
				Design provided by <a href="http://www.freewebtemplates.com/">Free
					Website Templates</a>.
				<!--##@%-->
			</p>
		</footer>
	</div>
	<p>&nbsp;</p>
	<!-- javascript at the bottom for fast page loading -->
	<script type="text/javascript" src="<?php echo $this->baseUrl('js/jquery.easing-sooper.js');?>"></script>
	<script type="text/javascript" src="<?php echo $this->baseUrl('js/jquery.sooperfish.js');?>"></script>
	<script type="text/javascript" src="<?php echo $this->baseUrl('js/jquery.kwicks-1.5.1.js');?>"></script>
	<script type="text/javascript">
    $(document).ready(function() {
      $('#images').kwicks({
        max : 600,
        spacing : 2
      });
      $('ul.sf-menu').sooperfish();
    });
  </script>
</body>
</html>
